.mine {
  .ml-5 {
    margin-left: 10rpx;
  }

  .mt-17 {
    margin-top: 34rpx;
  }

  .ml-11 {
    margin-left: 22rpx;
  }
  .ml-15 {
    margin-left: 30rpx;
  }
  .mr-5{
    margin-right: 10rpx;
  }
  &.page {
    background: linear-gradient(180deg, #232f5b 0%, #3c4a7e 100%);
    height: 100vh;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;

    .section {
      padding: 24rpx 28rpx 100rpx 28rpx;
      // border: 1rpx solid red;
      // background: linear-gradient(180deg, #232f5b 0%, #3c4a7e 100%);
      padding-bottom: 32rpx;

      // background-image: linear-gradient(171.1deg, #1c2c60 0%, #1d2f65 -14.46%, #adb4c9 46.78%, #ea602d00 100%);
      .profile-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 32rpx 32rpx 0 32rpx;
      }

      /* 顶部运动员切换条 */
      .athlete-switch-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16rpx 24rpx;
        background: transparent;
        border: 1rpx solid #000;
        border-radius: 16rpx;
        margin: 16rpx 0;

        .left {
          display: flex;
          align-items: center;

          .label {
            color: #8a8a8a;
            font-size: 26rpx;
          }
          .name {
            color: #fff;
            font-size: 28rpx;
            font-weight: 600;
            margin-left: 8rpx;
          }
        }

        .switch {
          display: flex;
          align-items: center;
          color: #666;
          font-size: 26rpx;

          .icon-box {
            width: 40rpx;
            height: 40rpx;
            border: 2rpx dashed #d8d8d8;
            border-radius: 8rpx;
            margin-left: 12rpx;
            display: flex;
            align-items: center;
            justify-content: center;

            .icon {
              width: 24rpx;
              height: 24rpx;
            }
          }
        }
      }

      .logo {
        width: 160rpx;
        height: 80rpx;
      }

      .join-days {
        color: #fff;
        font-size: 24rpx;
        margin-top: 8rpx;
      }

      .profile-info {
        display: flex;
        align-items: center;
        padding: 32rpx;
        background: transparent;
      }

      .avatar {
        width: 113rpx;
        height: 150rpx;
        border-radius: 16rpx;
        margin-right: 24rpx;
        border: 2rpx solid #fff;
      }

      .user-info {
        flex: 1;
        color: #fff;
      }

      .user-name {
        font-size: 32rpx;
        font-weight: bold;
        margin-bottom: 8rpx;
      }

      .user-meta {
        font-size: 24rpx;
        color: #e0e0e0;
        margin-bottom: 8rpx;
      }

      .meta-divider {
        margin: 0 8rpx;
      }

      .user-stats {
        font-size: 24rpx;
        color: #fff;
        display: flex;
        align-items: center;
      }

      .stat {
        display: flex;
        align-items: center;
        margin: 10rpx 30rpx 10rpx 0rpx;
      }

      .stat-divider {
        margin: 0 12rpx;
      }

      .iconfont {
        margin-right: 4rpx;
      }

      .profile-actions {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        margin-left: 16rpx;

        .share-text {
          color: #fff;
          margin-left: 15rpx;
          font-size: 28rpx;
        }
      }

      .share-btn {
        background: none;
        border: none;
        margin-bottom: 12rpx;
        padding: 0;
        display: flex;
        align-items: center;
      }

      .icon-btn {
        width: 36rpx;
        height: 36rpx;
      }

      .unfollow-btn {
        background: #fff;
        color: #232f5b;
        border-radius: 20rpx;
        font-size: 26rpx;
        // padding: 8rpx 32rpx;
        border: none;
        font-weight: bold;
        width: 110rpx;
        height: 50rpx;
        line-height: 50rpx;
      }

      .section {
        background: #19204a;
        border-radius: 16rpx;
        margin: 24rpx 24rpx 0 24rpx;
        padding-bottom: 16rpx;
      }

      .section-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 18rpx 18rpx 0 18rpx;
        color: #fff;
        font-size: 28rpx;
        font-weight: bold;
      }

      .section-logo {
        width: 80rpx;
        height: 32rpx;
      }

      .section-content {
        background: #232f5b;
        border-radius: 12rpx;
        margin: 18rpx;
        color: #fff;
        font-size: 26rpx;
        text-align: center;
        padding: 32rpx 0;
      }

      /* 最佳成绩记录样式 */
      .no-records {
        color: #999;
        font-size: 28rpx;
      }

      .records-list {
        padding: 0 24rpx;
      }

      .record-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: #2a3a6b;
        border-radius: 16rpx;
        padding: 24rpx;
        margin-bottom: 20rpx;
        color: #fff;

        .event-type {
          font-size: 28rpx;
          font-weight: 600;
          color: #fff;
          flex: 1;
          text-align: left;
        }

        .pb-time {
          display: flex;
          align-items: center;
          margin: 0 20rpx;

          .pb-label {
            font-size: 26rpx;
            color: #fff;
          }

          .pb-value {
            font-size: 28rpx;
            color: #ff6b35;
            font-weight: 600;
          }
        }

        .record-info {
          display: flex;
          flex-direction: column;
          align-items: flex-end;
          flex: 1;

          .location {
            font-size: 26rpx;
            color: #fff;
            margin-bottom: 8rpx;
          }

          .date {
            font-size: 24rpx;
            color: #ccc;
          }
        }
      }

      /* 荣誉记录样式 */
      .no-honors {
        color: #999;
        font-size: 28rpx;
      }

      .honors-list {
        padding: 0 24rpx;
      }

      .honor-item {
        position: relative;
        background: #2a3a6b;
        border-radius: 16rpx;
        padding: 24rpx;
        margin-bottom: 20rpx;
        color: #fff;
        overflow: hidden;

        .champion-tag {
          position: absolute;
          top: 0;
          left: 0;
          background: #ff6b35;
          color: #fff;
          font-size: 24rpx;
          font-weight: 600;
          padding: 8rpx 16rpx;
          border-radius: 0 0 12rpx 0;
        }

        .honor-content {
          margin-top: 20rpx;

          .top-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 16rpx;

            .event-type {
              font-size: 28rpx;
              font-weight: 600;
              color: #fff;
              flex: 1;
            }

            .group {
              font-size: 26rpx;
              color: #fff;
              margin: 0 20rpx;
            }

            .location {
              font-size: 26rpx;
              color: #fff;
              flex: 1;
              text-align: right;
            }
          }

          .bottom-row {
            display: flex;
            justify-content: space-between;
            align-items: center;

            .venue {
              font-size: 24rpx;
              color: #ccc;
              flex: 1;
              text-align: left;
            }

            .date {
              font-size: 24rpx;
              color: #ccc;
              flex: 1;
              text-align: right;
            }
          }
        }
      }

      .switch-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 32rpx 24rpx 0 24rpx;
        color: #fff;
        font-size: 24rpx;
      }

      .switch-label {
        margin: 0 12rpx;
      }
    }

    .text-wrapper {
      width: 90%;
      height: 90rpx;
      background-color: #213165;
      box-shadow: 0rpx 0rpx 18rpx 0rpx #ee73500a;
      border-radius: 22rpx;
      border: unset !important;
      // position: absolute;
      // bottom: 90rpx;
      // left: 50%;
      // transform: translate(-50%, 0);

      &::after {
        border: unset !important;
      }

      .text {
        color: #fff;
        font-size: 30rpx;
        font-family: 'PingFang SC';
        line-height: 90rpx;
      }
    }
  }

  /* 运动员弹窗样式 */
  .athlete-popup {
    background: #fff;
    border-radius: 24rpx 24rpx 0 0;
    max-height: 80vh;
    overflow: hidden;

    .popup-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 32rpx 36rpx; /* 增加左右内边距 */
      border-bottom: 1rpx solid #f0f0f0;

      .popup-title {
        font-size: 32rpx;
        font-weight: 600;
        color: #333;
      }
      .close-btn {
        width: 60rpx;
        height: 60rpx;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f5f5f5;
        border-radius: 50%;

        .close-text {
          font-size: 36rpx;
          color: #666;
        }
      }
    }

    .popup-scroll {
      max-height: 60vh;
      padding: 0 36rpx 28rpx 36rpx; /* 增加左右内边距，保持上下内边距 */
      width: 96%;
    }

    .empty-state {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 200rpx;
      color: #999;
    }

    .player-item {
      display: flex;
      align-items: center;
      padding: 24rpx; /* 增加内边距 */
      border-radius: 16rpx;
      border: 2rpx solid #f0f0f0;
      margin-bottom: 20rpx; /* 增加底部间距 */
      width: 96%;
      &.selected {
        border-color: #2196f3;
        background: #eaf4ff;
      }

      .player-avatar {
        width: 80rpx;
        height: 80rpx;
        border-radius: 50%;
        margin-right: 20rpx; /* 增加右边距 */
      }
      .player-info {
        flex: 1;
        display: flex;
        flex-direction: column;

        .player-name {
          font-size: 28rpx;
          color: #333;
          font-weight: 600;
        }
        .player-mobile {
          font-size: 24rpx;
          color: #999;
        }
      }
      .status-selected {
        color: #2196f3;
        font-size: 24rpx;
      }
      .status {
        color: #666;
        font-size: 24rpx;
      }
    }
  }
}